<template>
	<view>
		<view class="head">
			<text>{{name}}</text>
		</view>
		<view class="shop" >
			<view class="pic">
				<dimg :src='productList.cover'></dimg>
			</view>
			<view class="box">
				<view class="boxTop">{{productList.title}}</view>
				<view class="boxLeft">
					数量：{{amount}} (
					<text>¥{{parseFloat(total).toFixed(2)}}</text>
					)
				</view>
			</view>
		</view>
			<view class="size">
			<view class="sizeTop" v-for="(item,index) in productList.product_list" :key='index'>
				<view class="sizeLeft">
				<block v-for="(val, index) in item.spec_data" :key="index">
					{{ val }}
					<block v-if="index < item.spec_data.length - 1">/</block>
				</block>
				（¥{{item.sell_price}}）
					
					</view>
				<view class="sizeRight">X {{item.operate_num}}</view>
			</view>
			
		</view>
		<view class="tui">
			<view class="tuiLeft">
				退款金额
			</view>
			<view class="tuiRight">
				¥{{parseFloat(total).toFixed(2)}}
			</view>
		</view> 
		<view class="tui">
			<view class="tuiLeft">
			备注: 无
			</view>
			<view class="tuiRight">
		<image src="../../static/images/arrow_right.png" mode=""></image>
			</view>
		</view>
		<view class="but">
			<view class="butLeft" >
				应退 :
				 <text>¥ {{parseFloat(price).toFixed(2)}}</text>
				<image src="../../static/spe/01.png" mode="aspectFit" @click="adjust"></image>
			</view>
			<view class="btn f30 cfff tCenter" @tap="confirm()">确认提交</view>
		</view>
		<!-- 添加新规格弹窗 -->
		<uni-popup ref="popup" type="center">
			<view class="addContent">
				<view class="box">
					<view class="tit tCenter f36 c333">价格</view>
					<view class="input-box"><input type="number" placeholder="最多输入12个字符" v-model="price" /></view>
					<view class="btn f30 tCenter">
						<view class="dropBtn" @click="close">取消</view>
						<view class="submit" @click="open">确定</view>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
export default {
	data() {
		return {
			name:'' ,//供应商名称
			total: 0,// 退款数
			price:0,
			goodInfo:{},
			productList:{},
			goodList:[],
			supplierId:'',
			supplierId:'',//供应商ID
			amount:0 //数量

		};
	},
	onshow(){
     
	},
	onLoad(option) {
		this.goodInfo=this.productList=uni.getStorageSync('productList')
		this.goodList=uni.getStorageSync('productList').product_list
	    this.supplierId=uni.getStorageSync('supplierId')
		this.supplierId=option.supplierId
		console.log(this.productList)
		this.name = uni.getStorageSync('name');
		this.goodInfo.product_list.forEach(item => {
			this.amount+= +item.operate_num;
		});
		this.goodInfo.product_list.forEach(item => {
			this.price=this.total = +item.operate_num * +item.sell_price;
		});
		this.goodList.forEach(item=>{
			delete item.spec_data;
			delete item.owe_num;
			delete item.trade_sum;
			delete item.sale_num;
			delete item.unit_id;
			delete item.unit_name;
			delete item.convert_num;
			delete item.store_num;
		})
		

	},
	methods: {
	
		open() {
			this.$refs.popup.close();
		},
		close() {
			this.$refs.popup.close();
		},

		adjust() {
			
			this.$refs.popup.open();
		},
       confirm(){
		   let that=this;
		   that.$ajax('api/v1.supplier/addOrder',{
			   merchandiser_id:0,
			   is_payment:0,
			   product_list: JSON.stringify(that.goodList),
			   supplier_id:that.supplierId,
			   is_in_store:1,
			   payable:that.price,
			   order_type:2
		   }).then(res=>{
			   if(res.code==1){
				   that.$sToast('提交成功')
				  setTimeout(function(){
					  uni.navigateTo({
					  	url:'./PO'
					  })
				  },2000)
			   }
		   }).catch(res=>{
			   that.$sToast(res.message)
		   })
	   }

	}
};
</script>

<style lang="scss">
page {
	background-color: #f7f4f8;
}
.head {
	box-sizing: border-box;
	background-color: #ffffff;
	margin-top: 30rpx;
	padding: 30rpx 0;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
	position: relative;
	text {
		margin: 20px 30rpx;
	}
	.txt {
		margin: 40rpx 30rpx;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: rgba(102, 102, 102, 1);
		margin-top: 33rpx;
	}
	.bot {
		position: absolute;
		bottom: 0;
		height: 7rpx;
		width: 100%;
		background: url(../../static/client/xian.png) no-repeat center;
		background-size: 100% 100%;
	}
}
.shop {
	height: 204rpx;
	margin-top: 20rpx;
	padding: 35rpx;
	box-sizing: border-box;
	background-color: #ffffff;
	display: flex;
	border-bottom: 2rpx solid #eeeeee;
    .pic{
		width: 130rpx;
		height: 130rpx;
		image {
			width: 100%;
			height: 100%;
		}
	}
	
	.boxTop {
		margin-left: 40rpx;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
	}
	.boxLeft {
		margin-left: 40rpx;
		margin-top: 52rpx;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: rgba(102, 102, 102, 1);
		text {
			color: #f64444;
		}
	}
}
.size {
	padding:30rpx 30rpx 15rpx 30px;
	box-sizing: border-box;
	background-color: #ffffff;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(102, 102, 102, 1);
	overflow: hidden;
	.sizeTop {
		display: flex;
		justify-content: space-between;
		margin-bottom: 15rpx;
	}
}
.tui {
	margin-top: 20rpx;
	height: 110rpx;
	background-color: #ffffff;
	padding: 41rpx 33rpx;
	box-sizing: border-box;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
	display: flex;
	justify-content: space-between;
	image {
		width: 18rpx;
		height: 33rpx;
	}
}
.but {
	width: 100%;
	height: 110rpx;
	position: fixed;
	bottom: 0;
	background-color: #ffffff;
	display: flex;
	box-sizing: border-box;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	line-height: 110rpx;
	padding-left: 29rpx;
	.butLeft {
		width: 495rpx;
		background-color: #ffffff;
		display: flex;
		image {
			width: 44rpx;
			height: 44rpx;
			position: relative;
			top: 33rpx;
			left: 20rpx;
		}
		text {
			color: #f64444;
		}
	}
	.btn {
		line-height: 110rpx;
		flex: 1;
		background-color: #249AF6;
	}
}
</style>
